<template>
  <div p-36rpx>
    <div>
      实名认证（请上传真实的个人信息，认证通过后将无法修改）
    </div>
    <nut-config-provider :theme-vars="{
      cellBoxShadow: 'none',
      cellPadding: '23rpx 0',
      formItemTipFontSize: '24rpx'
    }">
      <nut-form label-position="top" :model-value="verify" :rules="rules" ref="ruleForm">
        <nut-form-item :show-error-line="false" label="姓名" prop="name">
          <nut-input :custom-style="verifyInputStyle" v-model="verify.name" placeholder="请输入姓名" type="text" />
        </nut-form-item>
        <nut-form-item :show-error-line="false" label="身份证" prop="idNumber">
          <nut-input :custom-style="verifyInputStyle" v-model="verify.idNumber" placeholder="请输入身份证" type="text" />
        </nut-form-item>
        <nut-form-item :show-error-line="false" label="银行开户行" prop="settlementBankBranchName">
          <nut-input :custom-style="verifyInputStyle" v-model="verify.settlementBankBranchName" placeholder="请输入银行开户行"
            type="text" />
        </nut-form-item>
        <nut-form-item :show-error-line="false" label="银行开户名" prop="settlementBankAccountName">
          <nut-input :custom-style="verifyInputStyle" v-model="verify.settlementBankAccountName" placeholder="请输入银行开户名"
            type="text" />
        </nut-form-item>
        <nut-form-item :show-error-line="false" label="银行账号" prop="settlementBankAccountNum">
          <nut-input :custom-style="verifyInputStyle" v-model="verify.settlementBankAccountNum" placeholder="请输入银行账号"
            type="text" />
        </nut-form-item>
      </nut-form>
    </nut-config-provider>
    <div>
      <div text-dark-color text-24rpx>提交认证申请后，工作人员将在三个工作日进行核对完成审核</div>
    </div>
    <submit title="提交" @click="submitVerify" />
  </div>
</template>

<script setup lang="ts">
import { applyDistribution } from '@/api/member';
import submit from '@/components/sheet-btn/index.vue';
import { InputStyle } from '@/constants/injection-key';
const verifyInputStyle = { ...InputStyle, marginBottom: '12rpx' }
interface Verify {
  name: string,
  idNumber: string,
  settlementBankBranchName: string,
  settlementBankAccountName: string,
  settlementBankAccountNum: string
}
const ruleForm = ref<any>(null)
// 认证
const verify = ref<Verify>({
  name: '',
  idNumber: '',
  settlementBankBranchName: '',
  settlementBankAccountName: '',
  settlementBankAccountNum: ''
})
// 规则
const rules = {
  name: [
    {
      required: true,
      message: '姓名不能为空',
      trigger: 'change',
    },
  ],
  idNumber: [
    {
      required: true,
      message: '身份证不能为空',
      trigger: 'change',
    },
  ],
  settlementBankBranchName: [
    {
      required: true,
      message: '银行开户行不能为空',
      trigger: 'change',
    },
  ],
  settlementBankAccountName: [
    {
      required: true,
      message: '银行开户名不能为空',
      trigger: 'change',
    },
  ],
  settlementBankAccountNum: [
    {
      required: true,
      message: '银行账号不能为空',
      trigger: 'change',
    },
  ],
}

// 提交验证
function submitVerify() {
  ruleForm.value.validate().then(async ({ valid }: any) => {
    if (valid) {
      const res = await applyDistribution(verify.value)
      if (res.data.success) {
        uni.showToast({
          title: "提交成功",
          icon: "none"
        })

        setTimeout(()=>{
          uni.navigateBack()
        },500)
      }
    } else {
      uni.showToast({
        title: "请填写完整信息",
        icon: "none"
      })
    }
  })
}


</script>
<style scoped>
page {
  background: #fff;
}
</style>
<style scoped>
</style>
